<!DOCTYPE html>
<html>

<head>
    <title>忘记密码页面</title>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="${ctxPath}/assets/common/libs/layui/css/layui.css?v=${constants.getReleaseVersion()}"/>
    <link rel="stylesheet" href="${ctxPath}/assets/common/css/login.css?v=${constants.getReleaseVersion()}" media="all">
    <style>
        body {
            background: url('/assets/expand/images/logo_bg1.jpg') no-repeat;
            height: 100%;
            width: 100%;
            background-size: cover;
            position: absolute;
            overflow: hidden;
        }

        .login-header {
            color: rgba(0, 0, 0, .85) !important;
        }

        .login-footer {
            color: rgba(0, 0, 0, 0.7) !important;
        }

        .login-footer a {
            color: rgba(0, 0, 0, 0.7) !important;
        }

        .login-footer a:hover {
            color: rgba(0, 0, 0, 0.4) !important;
        }

    </style>
    <script>
        if (window != top)
            top.location.replace(location.href);

    </script>
</head>

<body>
<div class="login-wrapper">

    <div class="login-header">
        <p style="color: rgb(0,0,0);font-family: '微软雅黑 Light';font-size: x-large"><img src="${ctxPath}/assets/common/images/logo2.jpg"> L-WokH日程云共享管理系统&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;忘记密码</p>
    </div>

    <div class=" login-body">
        <div class="layui-card">
            <!--<form class="layui-form" id="userForm" lay-filter="userForm">-->
            <div class="layui-card-header">
                <i class="layui-icon layui-icon-engine"></i>&nbsp;&nbsp;忘记密码
            </div>
            <form class="layui-card-body layui-form layui-form-pane" id="userForm" lay-filter="userForm" method="post">


                <div class="layui-form-item">
                    <label class="layui-form-label">账号<span style="color: red;">*</span></label>
                    <div class="layui-input-block">
                        <input name="account" placeholder="请输入您要找回的账号" type="text" class="layui-input">
                    </div>

                </div>


                <div class="layui-form-item" id="email">
                    <div class="layui-col-md9">
                        <label class="layui-form-label">邮箱<span style="color: red;">*</span></label>
                        <div class="layui-input-block">
                            <input name="email" placeholder="请输入邮箱" type="text" class="layui-input" autocomplete="off">
                        </div>
                    </div>
                    <div class="layui-col-md3">
                        <button data-method="offset" data-id="email" data-type="auto"
                                type="button" class="layui-btn layui-btn-fluid"><i class="layui-icon">&#xe605;</i>
                        </button>
                    </div>


                </div>


                <div class="layui-form-item">

                    <label class="layui-form-label">验证码<span style="color: red;">*</span></label>
                    <div class="layui-input-block">
                        <input name="password" placeholder="请输入验证码" type="text" class="layui-input">
                    </div>

                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">新密码<span style="color: red;">*</span></label>
                    <div class="layui-input-block">
                        <input name="rePassword" placeholder="请输入新密码" type="password" class="layui-input"
                               autocomplete="new-password">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">重复密码<span style="color: red;">*</span></label>
                    <div class="layui-input-block">
                        <input name="rePassword" placeholder="请输入重复密码" type="password" class="layui-input" >
                    </div>

                </div>




                    <div class="layui-form-item">
                        <button class="layui-btn layui-btn-fluid" lay-filter="btnSubmit" lay-submit>确 定</button>
                    </div>
                </div>

            </form>
            <!--</form>-->
        </div>
    </div>

    <div class="login-footer">
        <p>© 2020 <a href="https://gitee.com/welsonlin/d03" target="_blank">日程云共享管理系统 V1.0</a></p>
    </div>
</div>

@/* 加入contextPath属性和session超时的配置 */
<script type="text/javascript">
    var Feng = {
        ctxPath: "${ctxPath}",
        version: '${constants.getReleaseVersion()}'
    };

</script>
<script type="text/javascript"
        src="${ctxPath}/assets/common/libs/layui/layui.js?v=${constants.getReleaseVersion()}"></script>
<script type="text/javascript" src="${ctxPath}/assets/common/js/common.js?v=${constants.getReleaseVersion()}"></script>

<script>
    layui.use(['layer', 'carousel', 'form'], function() {
        var $ = layui.jquery;
        var layer = layui.layer;
        var carousel = layui.carousel;
        var device = layui.device;
        var form = layui.form;
        var buttomId = "全局变量";
        // 渲染轮播
        carousel.render({
            elem: '.layui-carousel',
            width: '100%',
            height: '60px',
            arrow: 'none',
            autoplay: true,
            trigger: device.ios || device.android ? 'click' : 'hover',
            anim: 'fade'
        });

                // 添加表单验证方法
        form.verify({
            psw: [/^[\S]{6,12}$/, '密码必须6到12位，且不能出现空格'],

            repsw: function (value) {
                /*var pastest = Feng.ctxPath;*/
                if (value !== $('#userForm input[name=password]').val()) {
                    return "两次密码输入不一致";
                }
            }
        });




        //触发事件
        var active = {

            offset: function(othis) {
                var type = othis.data('type'),
                    bId = othis.data('id'),
                    text = "验证码已经发送至您的邮箱！";
                layer.open({
                    type: 1,
                    title: "接收验证码",
                    offset: type //具体配置参考：http://www.layui.com/doc/modules/layer.html#offset
                    ,id: bId + type //防止重复弹出
                    ,content: '<div style="padding: 20px 100px;">' + text + '</div>',
                    btn: ['确定'],
                    btnAlign: 'c' //按钮居中
                    ,shade: 0 //不显示遮罩
                    <!--,yes: function() {-->
                        <!--layer.closeAll();-->
                        <!--layer.msg("验证码已经发送至您的邮箱！", {-->
                            <!--time: 2000,-->
                            <!--icon: 5-->
                        <!--});-->
                    <!--}-->
                     });
            },
        };

       $('#email .layui-btn').on('click', function() {
            var othis = $(this),
                method = othis.data('method');
            active[method] ? active[method].call(this, othis) : '';
        });



    });






</script>


</body>
</html>